import React, { FC, useContext, useMemo } from 'react';
import './JournalArticleQuote.less';
import { FormattedMessage } from '@@/exports';
import { Typography } from 'antd';
import * as API from '@/services';
import { correspVal } from '@/utils/biz';
import { HxConfigContext } from '@/layouts/HxConfigContext';
import { getArticleQuoteArr } from '@/pages/JournalPage/JournalDetail/commons/utils';
import useJournalArticleHelp from '@/pages/JournalPage/JournalDetail/commons/useJournalArticleHelp';

interface JournalArticleQuoteProps {
  article?: API.FrontArticle;
  copyable?: boolean;
  showTitle?: boolean;
}

const JournalArticleQuote: FC<JournalArticleQuoteProps> = (props) => {
  const { article, copyable = true, showTitle = true } = props;
  const { articleQuote } = useJournalArticleHelp(article);

  return (
    <div className={'hx-article-quote'}>
      {showTitle && (
        <span>
          <FormattedMessage id="text.format-citations" />：
        </span>
      )}
      <Typography.Paragraph copyable={copyable}>{articleQuote}</Typography.Paragraph>
    </div>
  );
};

export default JournalArticleQuote;
